<template>
  <div class="gun">
    <table class="table table-bordered" style="margin-top: 80px">
      <thead style="text-align: center">
        <tr>
          <th>班级id</th>
          <th>班级名</th>
          <th>课程名</th>

          <th>操作</th>
        </tr>
      </thead>
      <tbody>
        <tr v-for="(info, index) in infos" :key="index">
          <td>{{ info.classId }}</td>
          <td>{{ info.className }}</td>
          <td>{{ info.courseName }}</td>

          <td @click="del(index)" style="color: blue">
            <i class="icon icon-trash"></i>
          </td>
        </tr>
      </tbody>
    </table>
  </div>
</template>

<script>
export default {
  data() {
    return {
      infos: [],
      search: "",
    };
  },
  methods: {
    handleEdit(index, row) {
      console.log(index, row);
    },
    handleDelete(index, row) {
      console.log(index, row);
    },
  },
  mounted() {
    this.$axios
      .get("http://10.197.26.58:8001/getclasslist")
      .then((response) => {
        this.infos = response.data.slice(0, 10);
        console.log(this.infos);
      })
      .catch(function (error) {
        console.log(error);
      });
  },
};
</script>
<style scoped>
.gun {
  margin-top: 20px;
}
</style>